<template>
  <div class="index">
    <div class="banner">
      <img class="banner-image" src="../assets/loveGift.jpg">
      <img class="top" src="../assets/banner-top.png">
      <img class="top logo1" src="../assets/banner-logo1.png">
      <img class="top logo2" style="opacity: 0;" src="../assets/banner-logo2.png">
      <div class="banner-font">
        <img class="" src="../assets/love-text.png">
      </div>
      <img class="next" src="../assets/down1.png">
    </div>
  </div>
</template>
<script>
import getQueryString from '../api/url'

export default {
  data () {
    return {
      isShowExp: false
    }
  },
  methods: {
  }
}
</script>
<style lang="scss" type="text/scss">
  img {
    pointer-events: none;
  }

  .index {
    .banner {
      .top {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
      }
      .banner-image {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
      }
      .banner-font {
        position: fixed;
        bottom: 4vh;
        left: 0;
        width: 90%;
        margin-left: 5%;
        .btn {
          position: absolute;
          top: 85%;
          width: 40%;
          height: 8%;
        }
        .btn-left {
          left: 8%;
        }
        .btn-right {
          right: 8%;
        }
      }
      .next{
          position: fixed;
          bottom: 4vh;
          width: 8vw;
          left: 50%;
          margin-left: -4vw;
          z-index: 2;
      }
    }
  }
</style>
